I am currently trying to set up a background service for my app so that the app will be opened when the phone has been turned on. If I am not mistaken if the webapp's manifest contains the "background_page" then the background service should be running automatically without the app being open. Currently the background service is not running.
manifest
{
"version": "1.0",
"name": "Hello World",
"description": "Hello World",
"orientation":"portrait-primary",
"icons": {
"16": "/icons/icon_16.png",
"32": "/icons/icon_32.png",
"48": "/icons/icon_48.png",
"128": "/icons/icon_128.png"
},
"permissions":{
"background":{},
"backgroundservice":{},
"desktop-notification":{},
"webapps-manage":{}
},
"launch_path": "/index.html",
"background_page":"/background.html",
"developer": {
"name": "Charlie Hudson"
},
"default_locale": "en"
}
background
<!DOCTYPE html>
<html>
<script>
navigator.mozApps.mgtm.getSelf().launch();
</script>
</html>
As far as I can tell background_page was a property that was used around 2012 to facilitate this behavior but it has been retired before 1.0 came out. At least I can't find any references to it anymore. I don't have hard evidence on it though. Anyway, there are a couple of things you can do to create this behavior:
Push notifications and do syncing there. But it really depends on the data
Alarms. You can schedule an alarm every minute, when the app is killed by the OS it will come back alive through the alarms API. Downside is that if you miss the alarm (f.e. because the phone is off) the OS will just throw it away. So schedule a lot of them :p
There is no proper way of implementing this behavior afaik.
Also note that access to sensors is limited when not running as front process.
Related
I've searched the documentation, and I can't seem to figure out why if you refresh the working page on firebase hosting, it'll throw a 404. The site works perfectly unless you try to directly access a page, or if you refresh the page (my guess is there's a disparity between the client browser state and the server state). Any ideas?
The site: rockgodstudios.com
It was cleanUrls. Like a dummy, I had it outside of the hosting JSON. Moving it correctly fixed my issue. Posting for anybody in the future that has this issue.
I solved this with the help of this other issue:
Next JS on Firebase Hosting
Although this makes that every time you refresh on any page you're redirected to the "Home" page. In my case this was ok.
I fix this issue by using dynamicLinks :-
Create custom domain Dynamic Links
You can use rewrites to create custom domain Dynamic Links. Visit the Dynamic Links documentation for detailed information about setting up a custom domain for Dynamic Links. write this below code inside firebase.json file .
{
"hosting": {
"public": "out",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"cleanUrls": true,
"rewrites": [
{
"source": "/**",
"dynamicLinks": true
}
]
}
}
I use this tool to test my structured data:
https://search.google.com/structured-data/testing-tool
This is my page:
https://www.offersprive.eu/it/prod/Black%20Latte/56
If I try to check it, the response is empty
...But if I copy-and-paste my html content, the tool read it correctly
What can I do to read the link content? Is that a problem with React content loading?
Thanks.
I'm having this same issue.
Basically I have a static website (job board) built with React and want the job to show in the Google Job Network.
To do this the web page needs to contain structured data for Google to crawl.
I've tried some npm packages like react-structured-data which does get the data to appear in the header, but the data gets injected AFTER Google runs the scan, so the data does not yet exist for Google and therefore is returning zero results.
I have the same issue when I try using react-helmet.
I have the same issue when I try to append a script with the data to either the header or body upon ComponentDidMount or ComponentWillMount.
It's weird that it shows in the header when I do inspect elements but doesn't show in the header when I view page source.
Maybe one solution is server-side rendering, but there must be another way.
Possible answer
according to this answer, the Google might actually see the data, its just the testing tool doesn't see the data, which is quite a pain in the butt.
https://webmasters.stackexchange.com/questions/91064/structured-data-tool-doesnt-see-javascript-rendered-content
Also, this page:
https://developers.google.com/search/docs/guides/intro-structured-data#structured-data-format
says: Google can read JSON-LD data when it is dynamically injected into the page's contents, such as by JavaScript code or embedded widgets in your content management system.
Another potential solution, but less plausible because it still loads after the fact
Instead of using JSON-LD, use microdata attached to your elements, like if you go here:
https://schema.org/JobPosting
and click example 4, microdata tab
Then perhaps it will know to wait for your elements to load before scanning.
Testing these solutions now. I will update probably tomorrow as I am logging off soon.
UPDATE: I FOUND THE ANSWER
I have tried the above and it appears that the data is valid and Google does see it, it's just Google's Structured Data tool (and also some structured data chrome extensions) don't not see the data. This is because such tools scan the page before the data is loaded in. Other tools, wait until the data is loaded before scanning, and on those tools, it works.
For example: If you inspect your web page and click on the HTML element, and click "edit as html" and copy the entire html of you page, and paste that HTML as code into Google Structured Data tool, you should see that it now finds your data. Hopefully they fix that in the future but for now, you can at least try that to make sure your data is valid.
Another thing is, if you go to the Google Search Console and request the URL in question to be indexed by Google, then wait a day or so for it to process, then check back in on it. You will see that the Google Search Console DID find your data. So Google IS seeing your data, e.g. search console. It's just the broken Structured Data Tool from Google that is not seeing your data. Hopefully it is fixed soon.
For the record, how I was able to get this to work on my React app is by putting my data inside of Component Did Mount. E.g.
`componentDidMount() {
const googleJobNetworkScript = document.createElement("script");
googleJobNetworkScript.type = "application/ld+json";
googleJobNetworkScript.innerHTML = JSON.stringify({
"#context": "http://schema.org",
"#type": "JobPosting",
"baseSalary": "100000",
"jobBenefits": "Medical, Life, Dental",
"datePosted": "2011-10-31",
"description": "Description: ABC Company Inc. seeks a full-time mid-level software engineer to develop in-house tools.",
"educationRequirements": "Bachelor's Degree in Computer Science, Information Systems or related fields of study.",
"employmentType": "Full-time",
"experienceRequirements": "Minumum 3 years experience as a software engineer",
"incentiveCompensation": "Performance-based annual bonus plan, project-completion bonuses",
"industry": "Computer Software",
"jobLocation": {
"#type": "Place",
"address": {
"#type": "PostalAddress",
"addressLocality": "Kirkland",
"addressRegion": "WA"
}
},
"occupationalCategory": "15-1132.00 Software Developers, Application",
"qualifications": "Ability to work in a team environment with members of varying skill levels. Highly motivated. Learns quickly.",
"responsibilities": "Design and write specifications for tools for in-house customers Build tools according to specifications",
"salaryCurrency": "USD",
"skills": "Web application development using Java/J2EE Web application development using Python or familiarity with dynamic programming languages",
"specialCommitments": "VeteranCommit",
"title": "Software Engineer",
"workHours": "40 hours per week"
});
document.head.appendChild(googleJobNetworkScript);
}`
You can also append the child to document.body instead of document.head. Either should work. Your choice.
You could also use react-helmet, or react-structured-data from NPM, which some other people do, but I didn't see the need, since the above seems to work fine.
You can find the other structured data types at schema.org
Remember to either submit a new site map to Google or submit your site to the Google indexing API each time you have a new webpage or webpage with updated content that you would like Google to scan.
This post is long but I hope it covered all the bases and I hope it helps.
Having had a brief look at how your website loads; I believe you are using React Helmet. The issue is with this tool (and vanilla React in general) is that the page must be loaded and javascript run in order for your headers to be set and your content loaded.
Most tools that crawl webpages don't run javascript, Google now does on its main crawler I believe but they don't seem to have updated all their various tools. Facebook, Twitter, Bing etc, I believe it's patchy at best.
The answer is probably either Gatsby or Next.js; both provide ways of rendering your React code on the server or during the build so that all the headers and content are sent when your page is first called. You can write your own server side rendering methods but these solutions provide all that leg work.
This removes the need for a crawler to be running javascript; so you get index properly! For the sake of interest, when I ran into this issue I went for Gatsby.
A quick work around is do what you have your other links / meta tags; write them into the base index.html file. However, this obviously can't be updated per page etc...
Hope that shines some light on it :)
Google Structured Data Tool don't read my React Site content
i think its reading correctly,but not executing the js,that is google data tool use crawler to fetch the page,which is the source code of your page,to see on what content google tool is working ,just open your page and goto view page source,you can see google tool is working on this source,not on what generated by the react.
Is that a problem with React content loading?
this is because react components are rendered after the page load.and your content is not visible to crawler as webcrawler do not execute javascript.
i hope this will clear your doubt.
I would suggest you to have a look at React Helmet package, which can help you manage your <head> and structured data.
TLDR:
How do i make a create-react-app which has a button that logs "button pressed" to client-side console, and logs "client pressed the button" to the server's console?
Context:
As an exercise i decided to perform the simple task of having a button which when clicked on the client, logs to server console "task executed by client now." I quickly figured out that this is way, way beyond my understanding and that the fact that my app was built the create-react-app way, and i run it via "npm start" severely limits the control i have over what happens on the server side. I tried some pretty ugly hacks to get it to work, but i can't do it without losing some amount of functionality elsewhere in the app.
I program an app where I need GPS.
If the GPS is off, how can I ask the user to turn on GPS, like google maps? After a while of googleing I found nothing compareable...
My other question is, why I get "Use location? - 2", when the GPS is off? I thought, if the GPS is off, $window.navigator.geolocation is false?
controller.js
if ($window.navigator && $window.navigator.geolocation) {
function success(pos) {
$rootScope.position = { x: pos.coords.latitude, y: pos.coords.longitude };
}
function fail(error) {
alert("Use location? - 2");
}
$window.navigator.geolocation.getCurrentPosition(success, fail, { maximumAge: 500000, enableHighAccuracy: true, timeout: 6000 });
} else {
alert("Use location? - 1");
}
There are many plugins that promess to help you get if your gps is enable. Then you can ask the user to change Location Settings. One of them is the Diagnostics Plugin https://www.npmjs.com/package/cordova.plugins.diagnostic . I am using it. (al least to call the Location Settings).
The cordova-plugin-request-location-accuracy cordova plugin does trigger the native dialog window to ask the user to enable GPS from the app without having to navigate to the phone's settings and then back to you app.
https://github.com/dpa99c/cordova-plugin-request-location-accuracy
Only down side is that it only works on Android. It's not possible to turn on GPS from your app on iOS devices with this plugin. BUT, as mentioned in the plugin's documentation, you can use the cordova.plugins.diagnosticplugin to navigate to the phone's settings and manually turn on the GPS as a fallback for iOS devices.
I have done a lot of research on that and at the moment, this is the best solution I have found so far. I know the the Google Maps app on iOS does it, so it should be possible from a Cordova plugin, but I guess no one has done it yet.
UPDATE: There is a workaround to the problem. It is to force IE10 into compatibility mode by including one of the following meta tags:
<meta http-equiv="x-ua-compatible" content="IE=7" />
<meta http-equiv="x-ua-compatible" content="IE=8" />
This is not really a perfect solution for various reasons, but it eliminates the problem at least.
ORIGINAL QUESTION:
I realised a couple of months ago that there is a problem with our Silverlight application in IE10 on Windows 8 (I have not tried the IE10 preview for Windows 7). When the asp.net page hosting our SL app first loads everything works fine and the application loads as expected. If I refresh the page immediately, it also reloads as expected. But: If I focus the Silverlight application by clicking in it and THEN hit F5, it just goes blank. It is like the plugin disappears completely. If I trace the requests using Fiddler I can see that no request is issued for the xap file. I have been hoping that this would be fixed in a patch release for IE10, but so far nothing has changed. I cannot find any information about this when I try googling it. It seems highly unlikely that I should be the first person to discovered it and I am quite surprised that I am not finding more information. To reproduce the issue:
Create a new Silverlight application
Add some sort of content to MainPage.xaml, like a Button or whatever
Run the app in IE10 (on Win8)
Click anywhere within the Silverlight application. This is just to focus the plugin.
Refresh the page (F5)
Result: The Silverlight application does not load and the page is blank.
A few observations:
After the steps above, no amount of refreshing will bring the application back.
After the steps above, if I re-enter the url into the address bar and hit Enter, the application loads as expected.
If I enable Compatibility View in IE, the app also loads as expected. Nothing I do will reproduce the bug when compatibility view is enabled.
Now to my questions:
Has anyone else observed this behaviour?
If so, have you found a workaround?
I'm seeing the same issue with my Silverlight application in IE 10.
I've tried adding the IE 8 compatibility meta tag suggested above, but this does not resolve the problem consistently. It seems to work only intermittently, after say every 5th refresh attempt?!
The only way I can see to work around this consistently is to force the Browser Mode into "IE 10 Compatibility View", and I don't think this can be done via page content (meta tag, etc.)? I've had to remove the IE 8 compatibility meta tag so that the "Compatibility View" button is available in the address bar, and then ask users to click the compatibility button, which is then remembered for the site. This results in the browser entering Browser Mode: "IE 10 Compat View" and Document Mode: "IE7 Standards". The refresh behaviour then works consistently as expected and as it used to.
This is a big problem for us. We've built our Silverlight app such that the browser refresh button is used to refresh pages/content within the app (the users stays logged in, etc.). It's really bad that we have to ask users to set our site to run in compatibility mode for the refresh functionality to work as expected.
Note that this still works as expected in Chrome. It seems silly that we might need to recommend that our users use Chrome because of this issue!
UPDATE:
A workaround for this seems to be to always load the Silverlight object into its hosting page dynamically using JavaScript.
E.g.
function onLoad() {
var silverlightControlHost = document.getElementById("silverlightControlHost");
silverlightControlHost.innerHTML = "<object ...
UPDATE 2:
Here is the latest code I use to work around this issue:
...
function unloadSilverlight() {
document.getElementById("silverlightControlHost").innerHTML = "";
}
function focusOnSilverlight() {
document.getElementById("silverlightObject").focus();
}
function onLoad() {
window.onbeforeunload = unloadSilverlight;
setTimeout(focusOnSilverlight);
}
</script>
</head>
<body onload=" onLoad() ">
...
I still had issues with the solution presented by Chris.
This works perfectly for me though:
window.onbeforeunload = function () {
var silverlightControlHost = document.getElementById("silverlightControlHost");
silverlightControlHost.innerHTML = "";
}
I solved the problem in a very easy way. I Wrote a javascript code at the end of the page (or after the object tag in where is your silverlight app) and set the focus to another element, for example, a link. Example:
<object id="silverlightHostControl">...bla bla bla</object>
<script type="text/javascript" language="javascript">
var shc = document.getElementById("silverlightHostControl");
document.getElementById("myLink").focus();
</script>
The shc var is useless, I put just for clarify. Remember: your javascript code must set the focus to another (but focusable) object AFTER the silverlight app object tag was parsed, which means your js code is writen after silverlight app object.
In answer to your question #1, this is happening with our Silverlight apps as well. The only workarounds are 1) restart the browser or 2) switch to compatibiity mode.
It apparently is a bug in ie10.
Thanks for all workarounds solution but this is obviously a bug with Silverlight plugin.
We have raised few tickets directly with Internet explorer development team and they said the issue is from an external problem. It is not a good answer from Microsoft.
Anyway, this time our developers raised ticket through Silverlight development team which still waiting for their response. To get a good response from them, we need to get more people who are facing this issue.
You can vote this issue from Connect website which is Microsoft's official bug reporting platform.
The link to our ticket is: http://connect.microsoft.com/VisualStudio/feedback/details/789004/ie10-shows-blank-page-upon-refreshing-silverlight-app
Cheers
Moh
Yeah i am also facing same issue with one my application. If i opens help of my application in IE 10 then i have to refresh the page each time to view the contents.
I have two workaround for this issue:
1. Press ALT key once
2. Open IE in compatible mode