It has already been 10 days since the short-term project began.
A rough outline of the project is out.
However, I faced a situation where I couldn't integrate the Facebook API into the Chrome Extension.
Ah... I hope this gets resolved... Please save me...
I have solved it for now.
I did not do Facebook login separately. (Following a Google search) Someone had analyzed Facebook queries and uploaded them.
I only brought in and processed that part.
The following is the result of the processing.
Additionally, I received information from existing member Nam Doo-hyun regarding extracting thumbnail images from articles.
Tomorrow, I plan to work on extracting the thumbnail of an article using the article link.
I plan to do it in the following order.
1. HTML parsing
2. Character set acquisition through meta tag analysis (UTF-8, EUC-KR ... etc)
3. Re-parsing with the corresponding character set
4. Removing <script> and <style> through regular expressions
5. Removing <h2>, <span>, and <p> through regular expressions within <body>
6. Saving the length of text bundles and the text bundles within the cleaned body
7. Sorting
8. Deleting everything from the point where the sorted text suddenly becomes smaller
9. Finding img tags around the text-heavy parts and getting the href values
That is the theoretical part...
I will definitely try it tomorrow...
P.s I realized that my understanding of Chrome Extensions is quite low. When trying to just attach an existing Facebook API to an extension, it gets blocked by CSP... I think I spent 2 hours analyzing the following phrase.
Content Security Policy directive: "script-src 'self' chrome-extension-resource:".
As a result, I confirmed that it cannot be attached just like that...
I still don't know much about Facebook login. If anyone happens to know, please leave a comment. (_ _)
Thank you.
Oh...
Show more
I woke up in the morning and reviewed the Google documentation with a blurry mind.
(How to comply with Content Security Policy)
First, to comply, I needed to know what the CSP for Google Extensions is.
I hadn't seen what was written right below.
What is the CSP for Chrome Apps?
The content security policy for Chrome Apps restricts you from doing the following:
- You can’t use inline scripting in your Chrome App pages. The restriction bans both <script> blocks and event handlers (<button onclick="...">).
- You can’t reference any external resources in any of your app files (except for video and audio resources). You can’t embed external resources in an iframe.
-
You can’t use string-to-JavaScript methods like
eval()andnew Function().
Summarizing the above, it is like this.
_Content Security Policy for Chrome Apps.
1. You cannot use inline scripting. In html pages.
2. You cannot reference any external resources. Also, you cannot insert external resources inside an iframe.
3. You cannot use functions like eval() that functionalize strings.
Ah... In the end, we are forced to use only internal data. There is an effort to fundamentally block XSS vulnerabilities.
A lot of information about web hacking appears. When searching for XSS...
And looking below...
Your Chrome App can only refer to scripts and objects within your app, with the exception of media files (apps can refer to video and audio outside the package). Chrome extensions will let you relax the default Content Security Policy; Chrome Apps won’t.
Fortunately.. It says Chrome extensions allow relaxation, but Chrome Apps will not.
All JavaScript and all resources should be local (everything gets packaged in your Chrome App).
It recommends that all JavaScript and all resources be local data.
Then, is there really, truly no way to use external sources...
Looking below, there is more...
Use templating libraries
Use a library that offers precompiled templates and you’re all set. You can still use a library that doesn’t offer precompilation, but it will require some work on your part and there are restrictions.
You will need to use sandboxing to isolate any content that you want to do ‘eval’ things to. Sandboxing lifts CSP on the content that you specify. If you want to use the very powerful Chrome APIs in your Chrome App, your sandboxed content can't directly interact with these APIs (see Sandbox local content ).
Access remote resources
You can fetch remote resources via
XMLHttpRequest
and serve them via
blob:
,
data:
, or
filesystem:
URLs (see
Referencing external resources
).
Video and audio can be loaded from remote services because they have good fallback behavior when offline or under spotty connectivity.
Embed web content
Instead of using an iframe, you can call out to an external URL using a webview tag (see Embed external web pages ).
There are three ways.
1. Interaction between the main page and the sandboxing page using Sandbox and Chrome API
2. Referencing external resources via blob, etc., in XMLHttpRequest. (I don't think scripts will work)
3. Processing using an iframe.
In theory, it says that if you use the 3 methods, you can use external resources.
However, it doesn't mention the part about being able to use external scripts, so I'm not sure.
If I have an opportunity in the future, I will try to see if I can fetch scripts from the outside using the three methods.
For now, there is a next goal, so Pass...