I am trying to develop a visualization that relies on user-specific external graphics which are necessarily loaded from a remote source, but blocked by GDS's content security policy headers.
I'm looking for a way to stay within the CSP but still get the functionality I need. Are any of these things possible...?
Could I fetch graphical resources via a data source? (In which case I could build a custom data source connector that fetches the images and then feed those as a value into the visualization.)
Is there a valid way to load external resources of any type without violating the CSP?
Google's documentation suggests that they will relax their content security policy "in some cases." Is there an avenue to provide that?
Anyone who's managed to work around this, I'd appreciate some help figuring it out.
You can't make requests, but you can potentially render an svg/canvas image based on the data, so if you had the svg string of an icon as part of the datasource, you could render that.
2&3. There is no current way to make external requests without violating the CSP.
Related
I ran into a problem that I have never faced before developing a PWA with translations.
I state that I have always and only developed multilingual applications in Vue, React, Angular, and at the moment I am using Svelte.
I have always used simple practices, translation with a json dictionary and sending the Lang variable to the server for data acquisition in the requested language (set in the Headers).
All of this was fine until I encountered the need to receive the translated meta tags for the requested content immediately, during SSR, upon landing on the page. But as you know, at this stage there is no access to localStorage or similar, which is why it is impossible for me to acquire the meta tags in the requested language, since I do not have access to the variable set in the browser. How do you act in this case? I'm not interested in finding a specific solution for a certain framework, but a possible technique.
For Svelte I found this half solution, which allows me to obtain the slug / lang / from the address and use it in the server during the rendering phase, in order to obtain the data already translated on the server side.
Can I consider this a good solution?
I don't know what are you returning from the API, but if you have localized user defined content on backend, then this solution is good. If you are translating the app itself, you maybe you can give Tolgee a try, which supports SSR. https://tolgee.io/integrations/svelte
I want to integrate i18n within a ReactJS application that renders on client-side only.
I can handle the internationalization itself with one of the several i18n libraries available, however I was wondering which would be the best way/available options to store whatever language the user has chosen cross-request (like refreshing the page).
Is this something I can handle on the client-side only or do I have to do it server-side and then pass it to the client?
Thank you very much in advance.
You have limited options with storing a users preference using client side technology. Essentially, you are limited to storing these preferences in a cookie.
Any other sort of persisted data should be handled by the server and most likely saved to a database somewhere.
Our team is constantly working on an angular application, and every week or 2 we update it with new features or correct some bugs that came out.
We are using a C# backend with webservices.
QUESTION: When we update the application on the server, we sometimes (this doesn't happen all the time) get the problem that user is still seeing the old HTML and functionalities. What is the way to solve this?
I didn't find this on google, maybe I'm not looking for the right terms,
any help is appreciated.
Users have to clear their cache to get the new version of the application.
What you are seeing are cached copies of the JS files (possibly HTML partials too).
When the browser parses the HTML page, it makes the request for getting the JS resource and looks at various information before deciding to retrieve either the cached copy (if any) or whether to query the server again.
You can find some extra details on the Google fundamentals on HTTP caching
A solution I have been adopting myself is to set the cache headers to cache the file for a very long period, and then use tools in the build to version the file either on the filename or with a request parameter.
I have used grunt-cache-breaker and found it to serve well for this purpose. I know there is a gulp equivalent too
The most common way to make sure cached versions of your javascript aren't used is adding the version as a parameter in the reference to the script like so:
<script src="/app.js?v=v1.0"></script>
I have a function in the back-end that relies on the property names of an object, which is sent using AJAX with AngularJS. Can a user alter the property names using a debug tool, therefore changing what I would normally expect in the back-end? I suppose doing that would also affect the entire app in general if it was possible.
I guess it's kind of like someone using a debug tool to change the name attribute on a form and then submitting it. So I was curious to know if it's something I should ever keep in mind for AngularJS. I hope that makes sense.
If user is smart enough, he or she can change mostly everything using developer tools browser brings. What is more, if back-end endpoint is known, it easy to mock custom request with custom data.
You should always validate request since everything what doesn't come directly from your code can lead to security break.
The big downside of Ajax is that its requests are easily debugged using dev tools and, if are not designed correctly, expose your internal structures.
My company will allow customers to post suggestions to our website.
This feature is very similar to facebook share link.
Our customers will type a URL, we will scrape the site, retrieve the images, description and save the description and the image url in our database for other customers to review them later.
We don't have the resources to save/manipulate external image, unless it is absolutely necessary for now we will like to save the image url and render it onload.
The feature has been implemented but I have some concerns and would like to get some expert help to make sure I can prevent any issue from happening.
Scenario 1
Customer A, posts 5 suggestions from websites which contains large high quality images. Can I prevent the site to get a performance hit the first time I render and retrieve those images from the sites?, do you know if it would be illegal to save a local copy as long as I keep the reference to the original site? also I am against hotlinking but not sure if keeping a copy in my hard drive is a good idea.
I noticed facebook doesn't save them, they always render the image, I am sure they do it that way because that's the right way to do it.
b) Customer B misuses this feature and he actually try to do an XSS attack how can I take advantage of Anti-XSS 4.0 to make sure customer doesn't try an xss attack, encoding the output would be enough? is there any other security risk that I am not aware of?
Thanks for your help!
Google images and similar sites seem to get away with storing images locally. Not going to be practical to request permission from every website.
To prevent XSS attacks make sure the customer gives you a URL rather than some JavaScript. You can see some example XSS image attacks here: http://ha.ckers.org/xss.html