-
-
Notifications
You must be signed in to change notification settings - Fork 1.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
'SvgXml' for web #1279
Comments
It's mainly due to the different processing modes available in the browser, and the different security tradeoffs it has. https://www.w3.org/TR/SVG2/conform.html#examples People are likely not to understand the full implications of it, and use it when inappropriate. Thus I've left it up to consumers of the library to implement that if they need it, and then according to the security / risk model of the product it's applied to. Besides, svg / xml content from the web can be shown using e.g. |
any solution? |
Many solutions with different tradeoffs, thus no pre-prepared solution. |
You probably want to read these two threads: It depends very much on your web setup, what bundlers you use, other plugins, security considerations etc. There are too many. possible ways to want it to function to satisfy all possibilities of the configuration space. A maximally restrictive (security wise) default might make sense, i.e. not to parse the xml of content loaded from uri but rather let the browser handle it using img or css backgrounds https://svgwg.org/specs/integration/#secure-static-mode <img src='data:image/svg+xml;utf8,<svg ... > ... </svg>' /> .bg {
background: url('data:image/svg+xml;utf8,<svg ...> ... </svg>');
} Or something like this for ie compat: "Optimized URL-encoded" https://css-tricks.com/probably-dont-base64-svg/ <img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M224%20387.814V512L32 320l192-192v126.912C447.375 260.152 437.794 103.016 380.93 0 521.287 151.707 491.48 394.785 224 387.814z'/%3E%3C/svg%3E" /> |
Mind making a pr for a maximally secure version? |
Would this be fine:
source: https://dev.to/benjaminblack/using-a-string-of-svg-as-an-image-source-8mo |
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. You may also mark this issue as a "discussion" and I will leave this open. |
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. You may also mark this issue as a "discussion" and I will leave this open. |
Is this project completely dead? Should we find another solution? |
Just want to say I also have this issue, would be great to have your PR merged (if it works) |
Well, we created and are using this lib in the end: |
Thanks for your fix! Using now and looking forward to it being merged upstream. |
Thanks a lot, this worked for my project too - SvgUri is working properly with Webpack now. Also hoping your pull request #1686 will be merged into this repo in the near future. |
Just commenting to follow up on the recent (closed) Issues #2111 and #2075 and note that this also affects our project. It seems a bit bizarre to have these elements but not export them for web. Obviously developers can and should be responsible for understanding the security implications - but to simply not even export the components and instead silently break with a generic error (this took me over an hour to track down as a result) is not good developer experience. We are very grateful for this library and its devleopers, and have benefited from it for many years. I hope you will prioritize addressing this issue (which should not be that difficult to address in a basic way with the proper warnings for developers re: security) as soon as possible. |
Also, thanks to @Sharcoux and team for maintaining their fork at https://github.com/cantoo-scribe/rn-svg which addresses this in the meantime! Much appreciated. |
The react-native-svg project evolution was stopped due to the lack of maintainers, but it's being active again and this problem should be solved shortly. We are going to update the pull request and it should now be accepted. Everything should be back to normal. Just keep updated through the PR #1686 for the details. |
That’s great to hear! Thanks for the follow-up / update. Very much appreciated! |
…1916) # Summary **What issues does the pull request solve? Please tag them so that they will get automatically closed once the PR is merged** When utilizing with `react-native-web`: SvgXml and SvgUri are not exported in the `src/ReactNativeSVG.web.ts` extension. The logic for SvgXml and SvgUri do not have native dependencies, so they are safe to consume on web. Issues: - #1279 - #1742 **What is the feature? (if applicable)** Add SvgXml and SvgUri as consumable exports for `react-native-web` **How did you implement the solution?** Extract `tags` to shapes map into separate `tags.tsx` file, where native shape elements and web shape elements can be provided to their respective envs. **What areas of the library does it impact?** `src` directory ## Test Plan Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes UI. ### What's required for testing (prerequisites)? n/a ### What are the steps to reproduce (after prerequisites)? n/a ## Compatibility | OS | Implemented | | ------- | :---------: | | iOS | ✅ | | Android | ✅ | ## Checklist <!-- Check completed item, when applicable, via: [X] --> - [x] I have tested this on a device and a simulator - [x] I added documentation in `README.md` - [x] I updated the typed files (typescript) - [ ] I added a test for the API in the `__tests__` folder --------- Co-authored-by: bohdanprog <bohdan.artiukhov@swmansion.com>
I'm building an app with expo, and I get this error when using expo and trying to compile for web:
Attempted import error: 'SvgXml' is not exported from 'react-native-svg'.
I've noticed this issue has kind of come up before #1236
But why isn't there SvgXml support for web?
Shouldn't we be able to apply this to web? It would be nice to be able to dynamically generate svgs from strings and for it to work across all platforms. SVGs are already first class citizens in the browser, I feel like there should be some type of mechanism to just pass the markup to the DOM.
I'm not sure I understand the technical reasons for not including it or if it just hasn't been implemented yet. If it is a matter of implementation, I would be willing to put in a PR but I need some direction and what the scope of that would be.
The text was updated successfully, but these errors were encountered: