মার্কডাউনে একটি এসভিজি (গিটহাব হোস্ট করা) অন্তর্ভুক্ত করুন


173

আমি জানি যে সঙ্গে একটি চিত্র পারেন এমডি সিনট্যাক্স সঙ্গে একটি এমডি মধ্যে স্থাপন করা যেতে পারে ![Alt text](/path/to/img.jpg)বা ![Alt text](/path/to/img.jpg "Optional title"), কিন্তু আমি এমডি একটি করা SVG যেখানে কোড GitHub থেকে হোস্ট করা হয় স্থাপন অসুবিধা হচ্ছে না।

পরিশেষে rails3 ব্যবহার করে, এবং মডেল পরিবর্তন ঘন ঘন ডান এখন, তাই আমি ব্যবহার করছি RailRoady মডেলের স্কিমা ডায়াগ্রাম একজন করা SVG তৈরি করতে। আমি চাই যে সেই এসভিজি তারপরে ReadMe.md এ স্থাপন করা হবে এবং প্রদর্শিত হবে। আমি যখন স্থানীয়ভাবে এসভিজি ফাইলটি খুলি, এটি কাজ করে, তাই এমডি ফাইলে এসভিজি রেন্ডার করার জন্য ব্রাউজারটি কীভাবে পাব? প্রদত্ত কোডটি গতিশীল হবে যতক্ষণ না এটি চূড়ান্ত না হওয়া অবধি (আপাতদৃষ্টিতে কখনও দেখা যায় না), এসভিজিকে আলাদা জায়গায় হোস্টিং করা ওভারকিল বলে মনে হচ্ছে এবং এটি সম্পাদনের জন্য আমি একটি পদ্ধতির অভাব অনুভব করছি।

আমি যে এসভিজি অন্তর্ভুক্ত করার চেষ্টা করছি তা এখানে গিটহাবটিতে রয়েছে:https://github.com/specialorange/FDXCM/blob/master/Rails/fdxcm/doc/models_brief.svg

সিনট্যাক্সটি কাজ করছে কিনা তা যাচাই করতে আমি আসল চিত্রের পাশাপাশি নীচে চেষ্টা করেছি, কেবল এসভিজি কোডটি রেন্ডার করা হচ্ছে না:

![Overview][1]
[1]: https://github.com/specialorange/FDXCM/blob/master/doc/controllers_brief.svg  "Overview"

<img src="https://raw.github.com/specialorange/FDXCM/master/doc/controllers_brief.svg">

![Alt text](https://raw.github.com/specialorange/FDXCM/master/doc/controllers_brief.svg)

[Google Doc](https://docs.google.com/drawings/d/1B95ajItJTAImL2WXISX0fkBLYk3nldea4Vm9eo-VyE4/edit) :

<img src="https://docs.google.com/drawings/pub?id=117XsJ1kDyaY-n8AdPS3_8jTgMyITqaoT3-ah_BSc9YQ&w=960&h=720">

<img src="https://raw.github.com/specialorange/FDXCM/master/doc/controllers_brief.svg">

<img src="https://docs.google.com/drawings/d/1B95ajItJTAImL2WXISX0fkBLYk3nldea4Vm9eo-VyE4/edit">

এর ফলাফল পেতে:

সংক্ষিপ্ত বিবরণ 1 : https://github.com/sp خصوصیorange/FDXCM/blob/master/Rails/fdxcm/doc / controllers_brief.svg "ওভারভিউ"

বিকল্প পাঠ


গুগল ডক :


1
গিটহাবের এখন একটি প্রাসঙ্গিক ওপেন বাগ রিপোর্ট রয়েছে: github.com/github/markup/issues/556
সাম্পাব্লুকপার

লোকজনকে ক্লিক বাঁচাতে
গিথুব সম্পর্কিত

উত্তর:


206

এর উদ্দেশ্য raw.github.comহ'ল ব্যবহারকারীদের কোনও ফাইলের বিষয়বস্তু দেখার অনুমতি দেওয়া হয়, সুতরাং পাঠ্য ভিত্তিক ফাইলগুলির জন্য এর অর্থ (নির্দিষ্ট সামগ্রীর ধরণের জন্য) আপনি ব্রাউজারে ভুল শিরোনাম এবং জিনিসগুলি ভাঙ্গতে পারেন।

যখন এই প্রশ্নটি জিজ্ঞাসা করা হয়েছিল (২০১২ সালে) এসভিজিগুলি কাজ করে না। তার পর থেকে গিথুব বিভিন্ন উন্নতি বাস্তবায়ন করেছেন। এখন (কমপক্ষে এসভিজির জন্য), সঠিক সামগ্রী-প্রকারের শিরোনাম প্রেরণ করা হয়েছে।

উদাহরণ

নীচে বর্ণিত সমস্ত উপায় কাজ করবে।

নীচের উদাহরণগুলি তৈরি করার জন্য আমি প্রশ্ন থেকে এসভিজি চিত্রটি গিথুবের একটি রেপোতে অনুলিপি করেছি

আপেক্ষিক পাথ ব্যবহার করে ফাইলগুলির সাথে লিঙ্ক করা (কার্যত, তবে কেবলমাত্র github.com / github.io এ)

কোড

![Alt text](./controllers_brief.svg)
<img src="./controllers_brief.svg">

ফলাফল

Github.com এ কাজের উদাহরণটি দেখুন ।

RAW ফাইলগুলিতে লিঙ্ক করা হচ্ছে

কোড

![Alt text](https://raw.github.com/potherca-blog/StackOverflow/master/question.13808020.include-an-svg-hosted-on-github-in-markdown/controllers_brief.svg)
<img src="https://raw.github.com/potherca-blog/StackOverflow/master/question.13808020.include-an-svg-hosted-on-github-in-markdown/controllers_brief.svg">

ফলাফল

বিকল্প পাঠ

RAW ফাইলগুলি ব্যবহার করে লিঙ্ক করা ?sanitize=true

কোড

![Alt text](https://raw.github.com/potherca-blog/StackOverflow/master/question.13808020.include-an-svg-hosted-on-github-in-markdown/controllers_brief.svg?sanitize=true)
<img src="https://raw.github.com/potherca-blog/StackOverflow/master/question.13808020.include-an-svg-hosted-on-github-in-markdown/controllers_brief.svg?sanitize=true">

ফলাফল

বিকল্প পাঠ

Github.io এ হোস্ট করা ফাইলগুলির সাথে লিঙ্ক করা

কোড

![Alt text](https://potherca-blog.github.io/StackOverflow/question.13808020.include-an-svg-hosted-on-github-in-markdown/controllers_brief.svg)
<img src="https://potherca-blog.github.io/StackOverflow/question.13808020.include-an-svg-hosted-on-github-in-markdown/controllers_brief.svg">

ফলাফল

বিকল্প পাঠ


পথে ঘটে যাওয়া পরিবর্তন সম্পর্কিত কিছু মন্তব্য:

  • গিথুব এমন একটি বৈশিষ্ট্য প্রয়োগ করেছেন যা মার্কডাউন চিত্র সিনট্যাক্সের সাথে এসভিজির ব্যবহার সম্ভব করে। এসভিজি চিত্রটি স্যানিটাইজ করা হবে এবং সঠিক HTTP শিরোনামের সাথে প্রদর্শিত হবে। কিছু ট্যাগ (যেমন <script>) সরানো হয়েছে।

    স্যানিটাইজড এসভিজি দেখতে বা অন্য স্থান থেকে এই প্রভাব অর্জন করতে (যেমন: http://github.com/- এ রেপোতে হোস্ট করা না এমন মার্কডাউন ফাইলগুলি থেকে ) কেবল এসভিজির ?sanitize=trueকাঁচা ইউআরএল এ যুক্ত করুন।

  • মন্তব্যগুলিতে অ্যাডামকাটজ যেমন বলেছিলেন , গিথুব.ইও ব্যতীত অন্য কোনও উত্স ব্যবহার করা সম্ভাব্য গোপনীয়তা এবং সুরক্ষা ঝুঁকির পরিচয় দিতে পারে। দেখুন CiroSantilli দ্বারা উত্তর এবং DavidChambers দ্বারা উত্তর আরো বিস্তারিত জানার জন্য।

  • এটি সমাধান করার সমস্যাটি গিথুব 13 ই অক্টোবর 2015 এ খোলা হয়েছিল এবং 31 আগস্ট 2017 এ সমাধান করা হয়েছিল


কেবল পরিষ্কার করার জন্য, আপনি বলছেন যে এসভিজি চিত্রগুলি রেন্ডার হবে না , তাই না ?
শ্রীভাতসারআর

@ শ্রীভত্সআর না, কাঁচা.github.com ফাইল হটলিং করা ব্যতীত সবকিছু ঠিকঠাক কাজ করে। আমি গিথুব রেপোতে সবেমাত্র কিছু নামকরণ করেছি এবং উদাহরণগুলি ভঙ্গ করে আমার উত্তরটি আপডেট করতে ভুলে গিয়েছি। এখনই স্থির।
পুথেরকা

1
নিবন্ধন করুন গিথুব কখনই ফাইলগুলি হোস্টিংয়ের উপায় হিসাবে কাঁচা দৃষ্টিভঙ্গি ব্যবহার করে না, কেবল দেখার জন্য, তাই এটি একটি text/plainশিরোনাম প্রেরণ করে ।
পুথেরকা

2
সতর্কতা: Rawgit.com এবং Rawgithub.com গিটহাবের মালিকানাধীন বা পরিচালিত নয় , যা গোপনীয়তা এবং এমনকি সুরক্ষার ঝুঁকি আপত্তি থেকে এমনকি সুরক্ষার ঝুঁকির পরিচয় দেয়, যদি না ডিএনএস নিবন্ধনটি বিযুক্ত হয় তবে সম্ভবত ভবিষ্যতের মালিকের কাছ থেকে। এটি github.io সমাধানটিকে সবচেয়ে নিরাপদ করে তোলে। আরও দেখুন @ CiroSantilli এর উত্তর এবং @ davidchambers এর উত্তর যা উভয় নোট একটি পদ্ধতি এটা XSS ঝুঁকি যে এই সৃষ্টি করে।
অ্যাডাম কাটজ

1
@ মনসিআরডার্ট আমি আপনার উদ্বেগ উত্তরে যুক্ত করেছি।
পুথারকা

36

আমি গিথহাবের সাথে যোগাযোগ করে বলেছিলাম যে গিথুব.ইও-হোস্ট করা এসভিজিগুলি আর গীতহাব আরএডিএমইসে প্রদর্শিত হয় না। আমি এই উত্তর পেয়েছি:

সম্ভাব্য ক্রস সাইট স্ক্রিপ্টিং দুর্বলতার কারণে আমাদের GitHub.com এ এসজিজি চিত্র রেন্ডারিং অক্ষম করতে হয়েছিল।


3
অপেক্ষা করুন, এটা কি ঘটে? জানত না।
ক্যামিলো মার্টিন

আকর্ষণীয় যদিও, এটি ব্লব শোতে রেন্ডার করে: আমার উত্তর দেখুন । তাই আমি কেন বুঝতে পারি না কেন README এ নেই।
সিরো সান্তিলি 郝海东 冠状 病 六四 事件 法轮功

@ সিরোস্যান্টিলি 六四 事件 法轮功 包 卓 blo ব্লবটি এমন একটি আইফ্রেমে ব্যবহার করেছে যা এমবেডেড এসভিজির মতো এক্সএসএস করতে পারে না।
পেটাহ

3
এটি সম্ভব হলে ঠিক এখানে অনুসন্ধান করতে এসেছিলেন। এটি সম্ভব যে ধারণার প্রমাণ: jsfiddle.net/franciscop/krqea6gc
ফ্রান্সিসকো

1
এইচএম, এক্সএসএস আক্রমণ দেখতে এখানে ক্লিক করুন? খুশী হলাম।
অ্যাডাম কাটজ

15

Rawgit.com এই সমস্যাটি সুন্দরভাবে সমাধান করে। প্রতিটি অনুরোধের জন্য, এটি গিটহাব থেকে উপযুক্ত নথিটি পুনরুদ্ধার করে এবং, গুরুত্বপূর্ণভাবে সঠিক কন্টেন্ট-টাইপ শিরোনাম দিয়ে এটি সরবরাহ করে।


এটা সত্যিই দারুন! ওয়েবসাইটে পেস্ট করবেন? অথবা কেউ উদাহরণস্বরূপ স্ক্রিপ্টের মাধ্যমে ডায়নামিকভাবে url লিখতে পারেন। আমি এটি আমার পাঠ্য এক্সপান্ডারের স্নিপেটে অন্তর্ভুক্ত করতে চাই।
Eonist

আপনার প্রথমে ওয়েবসাইটটি দেখার দরকার নেই, @ গিটসিঙ্ক অ্যাপ্লিকেশন। :)
ডেভিডচেমার্স

1
নিজেকে উত্তর দিচ্ছে ... 😄 RawGit ব্যক্তিগত Repos জন্য নয় কাজ করে: github.com/rgrove/rawgit/issues/62
MonsieurDart

7
Rawgit.com চলে যাচ্ছে। ওয়েবসাইট অনুসারে: "কাঁচিটি তার কার্যকর জীবনের শেষ পর্যায়ে পৌঁছেছে 8 ই অক্টোবর, 2018 RawGit এখন একটি সূর্যাস্তের পর্যায়ে রয়েছে এবং শীঘ্রই বন্ধ হয়ে যাবে It's এটি একটি মজা পাঁচ বছর হয়েছে, তবে সমস্ত কিছু অবশ্যই শেষ হবে G গিটহাবের সংগ্রহশালা যা সামগ্রী সরবরাহ করেছিল গত মাসের মধ্যে রগজিটের মাধ্যমে কমপক্ষে 2019 সালের অক্টোবর পর্যন্ত পরিবেশন করা অব্যাহত থাকবে other অন্য সংগ্রহস্থলের URL গুলি আর সরবরাহ করা হচ্ছে না served আপনি যদি বর্তমানে রাগজিট ব্যবহার করছেন তবে দয়া করে যত তাড়াতাড়ি সম্ভব এটি ব্যবহার বন্ধ করুন। "
জেফেল

1
এছাড়াও rawgit.com সূর্যাস্ত ঘোষণা থেকে: "।। কি আপনি যদি এর পরিবর্তে ব্যবহার নিম্নলিখিত বিনামূল্যে পরিষেবা কিছু বা RawGit এর কার্যকারিতা সব কল্পনাপ্রসূত বিকল্প প্রদান করা উচিত আপনি তাদেরকে এমনকি অধিক RawGit jsDelivr GitHub পেজ CodeSandbox unpkg পছন্দ করতে পারেন"
jeffhale

8

এটি কাজ করবে। নিম্নলিখিত প্যাটার্নটি ব্যবহার করে আপনার এসভিজির লিঙ্ক করুন:

https://cdn.rawgit.com/<repo-owner>/<repo>/<branch>/path/to.svg

ডাউনসাইডটি মালিককে হার্ডকোডিং করছে এবং পথে রেপো, যার অর্থ এসভিজি ভেঙে যাবে যার মধ্যে দুটিরই নাম পরিবর্তন করা হলে।


ব্যবহারের আর একটি খারাপ দিক cdn.rawgit.comহ'ল "ফাইলগুলি ইউআরএলের উপর ভিত্তি করে স্থায়ীভাবে ক্যাশে করা হয়"। আপনি নাম বা পথ পরিবর্তন না করে আপনি যদি ফাইলটি পরিবর্তন করেন তবে এটি আপডেট হবে না।
মট্টি

@ মট্টি: কাঁচিটাকে এখন আপডেট হয়েছে: "আপনি গিটহাবের দিকে ধাক্কা দিয়ে নতুন পরিবর্তনগুলি কয়েক মিনিটের মধ্যেই প্রতিফলিত হবে।"
ইওনিস্ট

গুরুত্বপূর্ণ! : RawGit ব্যক্তিগত Repos জন্য কাজ করে না github.com/rgrove/rawgit/issues/62
MonsieurDart

5
আপডেট 2018. কাঁচিটি সূর্যাস্ত হয়। আমার মন্তব্য উপরে দেখুন।
জেফেল

8

আপডেট 2017

একজন গিথহব দেব বর্তমানে এটি অনুসন্ধান করছে: https://github.com/github/markup/issues/556#issuecomment-306103203

2014-15 আপডেট করুন : গিটহাব এখন ব্লাব শোতে এসভিজি রেন্ডার করে, তাই README রেন্ডারিংগুলিতে রেন্ডার না করার কোনও কারণ আমি দেখতে পাচ্ছি না:

এছাড়াও খেয়াল করুন যে এসভিজির একটি এক্সএসএস চেষ্টা রয়েছে তবে তা চালায় না: https://raw.githubusercontent.com/cirosantilli/test/2144a93333be144152e8b0d4144b77b211afce63/svg.svg

বিলিয়ন হাসির এসভিজি ফায়ারফক্স ৪৪ টি নিথর করে তোলে, তবে ক্রোমিয়াম 48 ঠিক আছে: https://github.com/cirosantilli/web-cheat/blob/master/svg-billion-laughs.svg

পেটা উল্লেখ করেছিল যে ব্লবগুলি ঠিক আছে কারণ এসভিজি একটি ভিতরে থাকে iframe

গিটহাবের এসভিজি চিত্র সরবরাহ না করার সম্ভাব্য যুক্তি

  • সাধারণ এক্সএমএল দুর্বলতা। উদাহরণস্বরূপ, এক বিলিয়ন হাসির শোষণ কেবলমাত্র ফায়ারফক্সকে আমার সিস্টেমকে ক্র্যাশ করেছে। শোষণযুক্ত ফায়ারফক্স বাগ যুক্ত: https://bugzilla.mozilla.org/page.cgi?id=voting/user.html । ক্রোমিয়ামে একই: https://code.google.com/p/chromium/issues/detail?id=231562

  • এসভিজি এক্সএসএস স্ক্রিপ্টিং: এসভিজি এম্বেড করা অবস্থায় যখন বেশিরভাগ ব্রাউজারগুলি স্ক্রিপ্টগুলি চালায় না img, মনে হয় এটি মানগুলির দ্বারা প্রয়োজনীয় নয়, তাই সম্ভবত গিটহাব এটি নিরাপদে খেলছে।

    ব্রাউজারগুলি এটি চালায় যদি আপনি সরাসরি এসভিজি খোলেন (তবে এটি প্রদর্শিত হবে যে গিটহাব কখনই সরাসরি github.comডোমেনে চিত্র দেখায় না ) বা যদি ইনলাইন হয় (যা বর্তমানে পুরোপুরি গিটহাব দ্বারা মুছে ফেলা হয়েছে), সুতরাং এই ক্ষেত্রেগুলি কোনও সুরক্ষার উদ্বেগ নয়। প্রাসঙ্গিক লিঙ্ক:

নিম্নলিখিত প্রশ্নগুলি সাধারণভাবে এসভিজির ঝুঁকি সম্পর্কে জিজ্ঞাসা করে: /security/11384/exploits-or-other-security-risks-with-svg-upload


2
যখন কোনও চিত্র ট্যাগের মাধ্যমে এসভিজি অ্যাক্সেস করা হয় তখন ব্রাউজারগুলি স্ক্রিপ্ট চালায় না। নিজেকে নিখরচায় পরীক্ষা করুন।
রবার্ট লঙ্গসন

@ রবার্টলংসন সংশোধন করার জন্য ধন্যবাদ। এটি কি কেবলমাত্র একটি সাধারণ ব্রাউজার আচরণের স্ট্যান্ডার্ডে নির্দিষ্ট করা হয়? এটি কি সুরক্ষার জন্য করা হয়েছে?
সিরো সান্তিলি 郝海东 冠状 病 六四 事件 法轮功

এটি গোপনীয়তার জন্য করা হয়েছে, এবং এটি সত্যই কোনও মানদণ্ডে নেই। লোকেরা বুঝতে পারে যে রাস্টার চিত্রগুলি কীভাবে কাজ করে এবং যখন কোনও চিত্র এসভিজি চিত্র হিসাবে একইভাবে কাজ করা উচিত তখন তারা কী করতে পারে / তা করতে পারে না।
রবার্ট লঙ্গসন

4

একটি ইমগ-ট্যাগ সহ আমার একটি কার্যকারী উদাহরণ রয়েছে, তবে আপনার চিত্রগুলি প্রদর্শিত হবে না। পার্থক্যটি আমি দেখতে পাই বিষয়বস্তুর ধরণ।

আমি আপনার পোস্ট থেকে গিথুব চিত্রটি পরীক্ষা করেছি (সংযোগ ব্যর্থতার কারণে গুগল ডক চিত্রগুলি লোড হয় না)। গিথুব থেকে চিত্রটি সামগ্রী-প্রকার: পাঠ্য / প্লেইন হিসাবে বিতরণ করা হয় যা আপনার ব্রাউজার দ্বারা চিত্র হিসাবে রেন্ডার হবে না।

এসভিজির জন্য সঠিক বিষয়বস্তুর ধরণের মান হ'ল চিত্র / এসভিজি + এক্সএমএল। সুতরাং আপনাকে নিশ্চিত করতে হবে যে এসভিজি ফাইলগুলি সঠিক মাইম টাইপ সেট করেছে তবে এটি একটি সার্ভার সমস্যা।

এটি ব্যবহার করে http://svg.tutorial.aptico.de/grafik_svg/dummy3.svg ব্যবহার করুন এবং ট্যাগটিতে প্রস্থ এবং উচ্চতা নির্দিষ্ট করতে ভুলবেন না।


1

এই সাইটটি ব্যবহার করুন: https://rawgit.com , এটি আমার পক্ষে কাজ করে কারণ আমার কাছে এসভিজি ফাইলের অনুমতি সংক্রান্ত সমস্যা নেই।
দয়া করে মনোযোগ দিন যে RawGit গিথুব কোনও পরিষেবা নয়, যেমন রাগজিট এফএকিউতে উল্লেখ করা হয়েছে :

RawGit কোনওভাবেই গিটহাবের সাথে সম্পর্কিত নয়। রগজিটের সাহায্য চাইতে দয়া করে গিটহাবের সাথে যোগাযোগ করবেন না

আপনার প্রয়োজন এসভিজি এর ইউআরএল প্রবেশ করুন, যেমন:

https://github.com/sel-fish/redis-experiments/blob/master/dat/memDistrib-jemalloc-4.0.3.svg

তারপরে, আপনি ইউআরএল বেলো পেতে পারেন যা প্রদর্শিত হতে পারে:

https://cdn.rawgit.com/sel-fish/redis-experiments/master/dat/memDistrib-jemalloc-4.0.3.svg

2
গুরুত্বপূর্ণ! : RawGit ব্যক্তিগত Repos জন্য কাজ করে না github.com/rgrove/rawgit/issues/62
MonsieurDart

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.