Cross origin framing Google VR - iframe

I'm trying to use the VR viewer from Google that you can find here:
https://developers.google.com/vr/concepts/vrview
Setup is pretty easy, no issue with this but I'm now having a cross origin framing issue on my own site. Here is an example:
http://laurentwillen.be/flat_files/vr.php
There I call the JS file and the JPG file from the same domain and same directory on the server but I still get this in my console:
Load denied by X-Frame-Options: http://www.laurentwillen.be/flat_files/index.html?image=http://www.laurentwillen.be/flat_files/VR/catane.jpg does not permit cross-origin framing.
I see here that the error refers to a html file that doesn't exist. Should I modify something in my htaccess file ?
Thanks
Laurent

The html file it is looking for ( index.html ) is part of the embed api. In the default setup for vrview, it is served from /
for example, here is the online demo root folder: http://googlevr.github.io/vrview/
(it will just show you an error atm, because you don't load it directly)
that directory (or some other you set up, i like to use /embed ) must serve that index page and its needed parts. (in /build and /images )
The examples are served from /examples, but the other directories are needed for the api to work.

Related

How to access html file inside iframe in production

I am creating a web app where, this app will generate a .html file in public/ directory. And after that i want to show that generated html file on a page using iframe .
I am using NextJS for this task. I have configured next.config.js for rewrites but getting 404 error. I am using Railway for hosting. Since in Vercel we can not access filesystem here.
Instead of generating html dynamically, if I upload that .html file, then i can access that file using iframe in production.
I think we can not access those files which were not available during build process. (this is my guess , maybe wrong)
How can I solve this problem or should I use another framework ?
Thanks
Since I was accessing .html files (i.e <iframe src="path-to-file"></iframe>) which were not available during build process, that's why i was getting 404 error.
So I did the following thing:
suppose I want to do this <iframe src="/pdf/page01.xhtml"></iframe> where file location is in public/pdf/page01.xhtml.
so this src is sending a GET request to localhost:3000/pdf/page01.xhtml.
To manipulate this request I created a pages/api/pdf/[...slug].js. In this file you can use process.cwd() to access the file inside your public dir. You read file content using fs.readFile and send the response res.status(200).send(data) like this.
By doing this I was getting the desired result.
Suggestions are always welcome.

Passing PNG file request to PHP scrpt in Nginx

Here is what I need to do - I need my server to serve up two versions of a set of images. The first set of images are real PNG files that sit in a folder on my server, call it /realimages. The second set of images do not actually exist. When they are requested I want to take the requested image file name e.g.
https://example.com/nosuchimage/img1.png
generate the image via the index.php script sitting inside the /nosuchmage folder (or elsewhere if easier).
That script does the following
Picks up a related image from the /realimages folder
Uses PHP GD to generate a background
Superimposes the related image on the background
serves up the result
That script has been written and is fully functional. What I do not know is how to force all PNG image requests to the /nosuchimage folder to be redirected to that script with the original request passed as a script parameterr.
I know that doing this a relatively trivial configuration issue with NGINX which involves writing a rewrite rule. However, NGINX rewriting is still quite a black art to me. Hopefully, someone here will be able to tell me just what that rewrite rule should be.
To redirect all the images of a certain folder, just use the code below in your configuration file.
In my case I will use the default file.
/etc/nginx/sites-available/default
location ~ \/realimages/(.+\.png)$ {
return 302 $scheme://$server_name/nosuchimage/$1;
}
// Access: http://www.example.com/images/valdeirpsr.png (Exists & Redirect to /nosuchimage/valdeirpsr.png)
// Access: http://www.example.com/images/valdeirpsr2.png (Not Exists & Redirect to /nosuchimage/valdeirpsr2.png)
To redirect only the images not found in a particular folder, just use the code below in your configuration file.
location ~ \/realimages/(.+\.png)$ {
error_page 404 $scheme://$server_name/nosuchimage/$1;
}
// Access: http://www.example.com/images/valdeirpsr.png (Exists & Show Image)
// Access: http://www.example.com/images/valdeirpsr2.png (Not Exists & Redirect to /nosuchimage/valdeirpsr2.png)

Using Server.MapPath() to generate img src, not working

This seems like a basic question, but I am looking for a proper way of doing this. I am displaying a series of images and their source in view looks like this:
src="#Server.MapPath(Path.Combine("~/App_Data/",photo.ClientId.ToString(),photo.PhotoId.ToString())+photo.FileExt.ToString())"
Which compiles to:
"c:\users\architect\documents\visual studio 2012\Projects\PhotoManagement\PhotoManagement\App_Data\5\62.jpg"
I triple checked that the files do exist at this location. Why does the browser refuse to display this image? Is there a workaround so that the code still works on the server when I upload it.
Thanks.
APP_Data is a restricted folder intended for Datasources such as Database only. ASP.Net will not deliver a file in here - try it by going to the URL for that image directly (I.E www.mysite/App_Data/5/62.jpg ) and you will see the error message HTTP Error 403 - Forbidden.
Put your images in a folder outside of this and you will be fine, such as a folder in the root Called Images
Server.MapPath returns the path of the image on the server. Unless the client happens to have an image in exactly the same path on their computer, this will not work.
Try using Url.Content instead:
src="#Url.Content(Path.Combine("~/App_Data/", photo.ClientId.ToString(), photo.PhotoId.ToString()) + photo.FileExt.ToString())"

Get Static referenced files with http request in meteor

This can be a silly question but I have had some issues with it. I am trying to implement jwplayer with meteor. Jwplayer will try to get a file based off the url you suggest. So I tried to place a file in localhost:3000/test.mp3. When I tried to hit that url I get just the default site. This would work if I used tomcat. Is there something I can do to get the files relative to meteor directory?
Thanks for your help.
In the /public directory, per the docs:
Lastly, the Meteor server will serve any files under the public directory, just like in a Rails or Django project. This is the place for images, favicon.ico, robots.txt, and anything else.
Meteor hasn't yet implemented server side routing and all directories are ultimately flattened. So for the time being, you can access your file at http://localhost:3000/test.mp3, but that may change in the future.

File not found error in Asp.net 4.0

On Local host,my solution works fine but on server when i deploy ,it gives that file not found error. and the error message is something like this.http://localhost:27375/favicon.ico
I don't have any such file in my application.I tried to create on in the root folder but no luck.any help is highly appreciated
Your favicon.ico file should be in your root directory for the web site.
It looks like your application is still trying to connect to the localhost in order to display the favicon. Are you hard-coding your URL to the favicon with a http://localhost:27275/favico.ico address?
To build on what Internet Engineer said, using ASP.NET, you can use a relative path prefaced with ~ or /. So, you can use ~/favico.ico or /favico.ico in order to reference your icon file.
First check in web server if you can see the file directly in the browser:
http://productionwebsite/favico.ico
If the file is there, now you need to check that the code is using relative paths. Most likely this is coded using absolute paths.

Resources