一種從網頁中獲取二維碼信息的方法及系統與流程

本發明涉及互聯網技術領域，特別是一種從網頁中獲取二維碼信息的方法及系統。

背景技術：
二維碼（2Dbarcode)是在條形碼基礎上發展出來的，用某種特定的幾何圖形按一定規律在平面（二維方向）分布的黑白相間的圖形用于記錄數據信息。其在代碼編制上巧妙地利用構成計算機內部邏輯基礎的“0”、“1”比特流的概念，使用若干個與二進制相對應的幾何形體來表示文字數值信息。由于，二維碼相較于條形碼具有信息量更大的優勢，因此在現代商業活動中得到了十分廣泛的應用，如：產品防偽/溯源、廣告推送、網站鏈接、數據下載、商品交易、定位/導航、電子憑證、車輛管理等等。目前，二維碼的識別過程一般是通過圖像輸入設備（如攝像頭等）或光電掃描設備獲取二維碼圖像后，自動解碼識讀所獲取的二維碼圖像以實現信息的自動處理。隨著移動終端和互聯網技術的發展，人們越來越多的通過手機等移動終端對網頁進行訪問。而通過移動終端訪問網頁的過程中存在以下問題：網頁中存在著一些二維碼圖片，而基于前述目前二維碼的識別方式的原因，移動終端無法直接地獲取網頁中相關二維碼所存儲的信息。如果想獲取相應的信息，就需要利用另外的終端進行拍攝或掃描來獲取二維碼圖像后再進行相應識別，用戶的體驗較差。

技術實現要素：
本發明實施例的主要目的在于提供一種從網頁中獲取二維碼信息的方法及系統。本發明實施例的目的是通過下述技術方案予以實現的：一種從網頁中獲取二維碼信息的方法，其特征在于，包括：遍歷網頁中的各個節點，判斷當前節點是否為圖片節點；如果當前節點為圖片節點，則獲取該圖片節點的圖片信息；根據所獲取的圖片信息，判斷該圖片信息是否為二維碼圖片；如果該圖片信息為二維碼圖片，則識別該二維碼圖片，獲取該二維碼圖片中所存儲的二維碼信息；建立該二維碼信息與相應二維碼圖片節點之間的對應關系。所述如果當前節點為圖片節點，則獲取該圖片節點的圖片信息，包括：如果當前節點為圖片節點，則判斷該圖片節點是否進行顯示；如果所述圖片節點進行顯示，則獲取該圖片節點的圖片信息。還包括：在接收到點擊該二維碼圖片節點的指令后，顯示所述二維碼圖片節點相對應的二維碼信息，或者鏈接至所述二維碼圖片節點對應的二維碼信息所指向的網絡地址。還包括：建立與所述二維碼圖片節點相對應的按鈕；在接收到點擊所述按鈕的指令后，顯示所述二維碼圖片節點相對應的二維碼信息，或者鏈接至所述二維碼圖片節點對應的二維碼信息所指向的網絡地址。一種從網頁中獲取二維碼信息的系統，其特征在于，包括：節點遍歷單元、圖片信息獲取單元、二維碼圖片判斷單元、二維碼圖片識別單元、二維碼信息對應單元；所述節點遍歷單元，用于遍歷網頁中的各個節點，判斷當前節點是否為圖片節點；所述圖片信息獲取單元，用于在當前節點為圖片節點時，獲取該圖片節點的圖片信息；所述二維碼圖片判斷單元，用于根據所獲取的圖片信息，判斷該圖片信息是否為二維碼圖片；所述二維碼圖片識別單元，用于在該圖片信息為二維碼圖片時，識別該二維碼圖片，獲取該二維碼圖片中所存儲的二維碼信息；所述二維碼信息對應單元，用于建立該二維碼信息與相應二維碼圖片節點之間的對應關系。還包括：圖片節點顯示判斷單元；所述圖片節點顯示判斷單元，用于在當前節點為圖片節點時，判斷該圖片節點是否進行顯示；所述圖片信息獲取單元，用于在該圖片節點為進行顯示時，獲取該圖片節點的圖片信息。還包括：二維碼執行單元；所述二維碼執行單元，用于在接收到點擊所述二維碼圖片節點的指令后，顯示所述二維碼圖片節點相對應的二維碼信息，或者鏈接至所述二維碼圖片節點對應的二維碼信息所指向的網絡地址。還包括：二維碼按鈕建立單元和二維碼執行單元；所述二維碼按鈕建立單元，用于建立與所述二維碼圖片節點相對應的按鈕；所述二維碼執行單元，用于在接收到點擊所述按鈕的指令后，顯示所述二維碼圖片節點相對應的二維碼信息，或者鏈接至所述二維碼圖片節點對應的二維碼信息所指向的網絡地址。通過本發明實施例，用戶無需利用另外的終端進行拍攝或掃描來獲取相關二維碼信息，而是可以直接通過該瀏覽器即可獲取相關二維碼信息，方便了用戶使用。附圖說明此處所說明的附圖用來提供對本發明的進一步理解，構成本申請的一部分，并不構成對本發明的限定。在附圖中：圖1為從網頁中獲取二維碼信息的方法的流程圖；圖2為從網頁中獲取二維碼信息的方法實施例二的流程圖；圖3為從網頁中獲取二維碼信息的系統的結構示意圖；圖4為從網頁中獲取二維碼信息的系統實施例六的結構示意圖。具體實施方式為使本發明的目的、技術方案和優點更加清楚明白，下面結合實施方式和附圖，對本發明做進一步詳細說明。在此，本發明的示意性實施方式及其說明用于解釋本發明，但并不作為對本發明的限定。實施例一圖1為從網頁中獲取二維碼信息的方法的流程圖。如圖所示，該從網頁中獲取二維碼信息的方法，包括：S1，遍歷網頁中的各個節點，判斷當前節點是否為圖片節點；具體的，可以通過網頁的DOMTree來對網頁的各個節點進行遍歷。DOMTree是指通過DOM將HTML頁面進行解析，并生成的HTMLtree樹狀結構和對應訪問方法。S2，如果當前節點為圖片節點，則獲取該圖片節點的圖片信息；S3，根據所獲取的圖片信息，判斷該圖片信息是否為二維碼圖片；這里，我們可以將所述圖片信息發送至二維碼圖片識別單元進行二維碼識別，根據該識別裝置是否能夠成功識別二維碼判斷該圖片信息是否為二維碼圖片。S4，如果該圖片信息為二維碼圖片，則識別該二維碼圖片，獲取該二維碼圖片中所存儲的二維碼信息；S5，建立該二維碼信息與相應二維碼圖片節點之間的對應關系。本發明實施例在具體實施時可實施在瀏覽器中。當用戶打開瀏覽器瀏覽網頁時，網頁加載完后即可啟動上述從網頁中獲取二維碼信息的方法。本發明實施例所提供的方法逐個識別網頁中的各個圖片節點，如果成功識別出圖片為二維碼圖片，則獲取該圖片的二維碼信息并與該圖片節點建立對應關系，以備用戶在進行相關操作時可以獲取該圖片節點所對應的二維碼信息。通過上述方法，用戶無需利用另外的終端進行拍攝或掃描來獲取相關二維碼信息，而是可以直接通過該瀏覽器即可獲取相關二維碼信息，方便了用戶使用。應當指出，上述本發明實施例所提供的方法并不僅限于移動終端使用，在個人電腦等固定終端中同樣適用。實施例二由于網頁中有部分圖片節點是并不顯示的，而二維碼圖片必然是需要在網頁上進行顯示的。因此，在本實施例中，我們還依據圖片節點是否進行顯示來進一步對圖片節點進行篩選，以提高該方法的處理效率。如圖2所示，優選地，所述如果當前節點為圖片節點，則獲取該圖片節點的圖片信息，包括：S21，如果當前節點為圖片節點，則判斷該圖片節點是否進行顯示；S22，如果該圖片節點不進行顯示，則忽略該節點，不作處理。S23，如果該圖片節點進行顯示，則獲取該圖片節點的圖片信息。如前所述，由于二維碼圖片必然是需要在網頁上進行顯示的，因此不進行顯示的圖片節點必然不是我們所需要的二維碼圖片節點。我們通過上述判斷步驟可以更快的篩選出二維碼圖片節點，提高該方法的處理效率。關于節點是否進行顯示的判斷，我們可以通過該節點對應的render樹中的“display”屬性值是否為“none”,或者“visibility”屬性值是否為“hidden”來判斷。例如，<imgsrc="/images/LOGO.png"/style="display:none；">，即說明該節點為不進行顯示的節點，因此不需要對其進行二維碼圖片判斷。實施例三本實施例在前述實施例一的基礎上，所述從網頁中獲取二維碼信息的方法，還包括：在接收到點擊該二維碼圖片節點的指令后，顯示該二維碼圖片節點相對應的二維碼信息，或者鏈接至該二維碼圖片節點對應的二維碼信息所指向的網絡地址。根據本實施例所提供的方案，在建立二維碼信息與相應二維碼圖片節點之間的對應關系后，用戶可以通過點擊該二維碼圖片節點操作來實現獲取該二維碼信息或鏈接至該二維碼圖片節點相對應的二維碼信息所指向的網絡地址的操作。通過本實施例，用戶無需利用另外的終端進行拍攝或掃描來獲取相關二維碼信息，而是可以直接通過該瀏覽器即可獲取相關二維碼信息，方便了用戶使用。實施例四本實施例在前述實施例一的基礎上，所述從網頁中獲取二維碼信息的方法，還包括：建立與所述二維碼圖片節點相對應的按鈕；在接收到點擊所述按鈕的指令后，顯示該二維碼圖片節點相對應的二維碼信息，或者鏈接至該二維碼圖片節點對應的二維碼信息所指向的網絡地址。通過本實施例，在建立二維碼信息與相應二維碼圖片節點之間的對應關系后，會在該圖片上顯示提示用戶這是個二維碼圖片的按鈕。當用戶點擊該按鈕時，則顯示該二維碼信息或鏈接至該二維碼圖片節點相對應的二維碼信息所指向的網絡地址。實施例五圖3為從網頁中獲取二維碼信息的系統的結構示意圖。如圖所示，該從網頁中獲取二維碼信息的系統，包括：節點遍歷單元1、圖片信息獲取單元2、二維碼圖片判斷單元3、二維碼圖片識別單元4、二維碼信息對應單元5。所述節點遍歷單元1，用于遍歷網頁中的各個節點，判斷當前節點是否為圖片節點；具體的，該節點遍歷單元1可以通過網頁的DOMTree來對網頁的各個節點進行遍歷。DOMTree是指通過DOM將HTML頁面進行解析，并生成的HTMLtree樹狀結構和對應訪問方法。所述圖片信息獲取單元2，用于在當前節點為圖片節點時，獲取該圖片節點的圖片信息；所述二維碼圖片判斷單元3，用于根據所獲取的圖片信息，判斷該圖片信息是否為二維碼圖片；所述二維碼圖片識別單元4，用于在該圖片信息為二維碼圖片時，識別該二維碼圖片，獲取該二維碼圖片中所存儲的二維碼信息；這里，該二維碼圖片判斷單元3和二維碼圖片識別單元4可以整合在一起，通過將所述圖片信息發送至二維碼圖片識別單元進行二維碼識別，根據該識別裝置是否能夠成功識別二維碼判斷該圖片信息是否為二維碼圖片。此方案亦應在本發明的保護范圍之內。所述二維碼信息對應單元5，用于建立該二維碼信息與相應二維碼圖片節點之間的對應關系。本發明實施例在具體實施時可實施在瀏覽器中。當用戶打開瀏覽器瀏覽網頁時，網頁加載完后即可啟動上述從網頁中獲取二維碼信息的系統。本發明實施例所提供的系統逐個識別網頁中的各個圖片節點，如果成功識別出圖片為二維碼圖片，則獲取該圖片的二維碼信息并與該圖片節點建立對應關系，以備用戶在進行相關操作時可以獲取該圖片節點所對應的二維碼信息。通過上述系統，用戶無需利用另外的終端進行拍攝或掃描來獲取相關二維碼信息，而是可以直接通過該瀏覽器即可獲取相關二維碼信息，方便了用戶使用。應當指出，上述本發明實施例所提供的系統并不僅限于移動終端使用，在個人電腦等固定終端中同樣適用。實施例六由于網頁中有部分圖片節點是并不顯示的，而二維碼圖片必然是需要在網頁上進行顯示的。因此，在本實施例中，我們還依據圖片節點是否進行顯示來進一步對圖片節點進行篩選，以提高該方法的處理效率。如圖4所示，優選地，該從網頁中獲取二維碼信息的系統，還包括：圖片節點顯示判斷單元6。所述圖片節點顯示判斷單元6，用于在當前節點為圖片節點時，判斷該圖片節點是否進行顯示；所述圖片信息獲取單元2，用于在該圖片節點為進行顯示時，獲取該圖片節點的圖片信息。如前所述，由于二維碼圖片必然是需要在網頁上進行顯示的，因此不進行顯示的圖片節點必然不是我們所需要的二維碼圖片節點。我們通過上述圖片節點顯示判斷單元6對圖片節點是否進行顯示判斷可以更快的篩選出二維碼圖片節點，提高該方法的處理效率。關于節點是否進行顯示的判斷，圖片節點顯示判斷單元6可以通過該節點對應的render樹中的“display”屬性值是否為“none”,或者“visibility”屬性值是否為“hidden”來判斷。例如，<imgsrc="/images/LOGO.png"/style="display:none；">，即說明該節點為不進行顯示的節點，因此不需要對其進行二維碼圖片判斷。實施例七本實施例在前述實施例五的基礎上，所述從網頁中獲取二維碼信息的系統，還包括：二維碼執行單元。所述二維碼執行單元，用于在接收到點擊該二維碼圖片節點的指令后，顯示該二維碼圖片節點相對應的二維碼信息，或者鏈接至該二維碼圖片節點對應的二維碼信息所指向的網絡地址。根據本實施例所提供的方案，在建立二維碼信息與相應二維碼圖片節點之間的對應關系后，用戶可以通過點擊該二維碼圖片節點操作來實現獲取該二維碼信息或鏈接至該二維碼圖片節點相對應的二維碼信息所指向的網絡地址的操作。通過本實施例，用戶無需利用另外的終端進行拍攝或掃描來獲取相關二維碼信息，而是可以直接通過該瀏覽器即可獲取相關二維碼信息，方便了用戶使用。實施例八本實施例在前述實施例五的基礎上，所述從網頁中獲取二維碼信息的系統，還包括：二維碼按鈕建立單元和二維碼執行單元。所述二維碼按鈕建立單元，用于建立與所述二維碼圖片節點相對應的按鈕；所述二維碼執行單元，用于在接收到點擊所述按鈕的指令后，顯示該二維碼圖片節點相對應的二維碼信息，或者鏈接至該二維碼圖片節點對應的二維碼信息所指向的網絡地址。通過本實施例，在二維碼信息對應單元5建立二維碼信息與相應二維碼圖片節點之間的對應關系后，二維碼按鈕建立單元會在該圖片上顯示提示用戶這是個二維碼圖片的按鈕。當用戶點擊該按鈕時，二維碼執行單元則顯示該二維碼信息或鏈接至該二維碼圖片節點相對應的二維碼信息所指向的網絡地址。綜上所述，本發明實施例提供了一種從網頁中獲取二維碼信息的方法及系統。該方法及系統通過便利網頁中的各個節點，并識別其中的二維碼圖片節點，自動建立二維碼信息與相應二維碼圖片節點之間的對應關系。通過上述方法及系統，用戶無需利用另外的終端進行拍攝或掃描來獲取相關二維碼信息，而是可以直接通過該瀏覽器即可獲取相關二維碼信息，方便了用戶使用。本領域一般技術人員在此設計思想之下所做任何不具有創造性的改造，均應視為在本發明的保護范圍之內。